<template>
	<!-- <view class="container">
		<view class="invest-title">充值金额</view>
		<view class="input-box">
			<text class="icon-money">￥</text>
			<input type="number" @input="inputmoney" v-model="money" />
		</view>
		<view class="invest-style">充值方式</view>
		<view class="vx-box" @click="govx">
			<view class="vx-icon">
				<image src="../../static/balance/vx.png" mode="widthFix"></image>
			</view>
			<view class="vx-text">微信支付</view>
			<image class="uncheck" src="../../static/balance/check.png" mode="widthFix" v-if="flag"></image>
			<view class="uncheck ap" v-else></view>
		</view>
		<view class="zfb-box" @click="gozfb">
			<view class="vx-icon">
				<image src="../../static/balance/zfb.png" mode="widthFix"></image>
			</view>
			<view class="vx-text zfb-text">支付宝支付</view>
			<image class="uncheck" src="../../static/balance/check.png" mode="widthFix" v-if="flag1"></image>
			<view class="uncheck " v-else></view>
		</view>
		<view class="invest" :class="{'invest-after':flag2}" @click="sureChong">确认充值</view>
	</view> -->
	<view>
		<image :src="img" mode="aspectFit" class="ma"></image>
		<view class="text">
			会员开通费用300，支付时 备注注册会员手机号，如：“13888888888，开通会员服务”
		</view>
	</view>
</template>

<script>
	import {pay} from "../../api/user.js"
	export default {
		data() {
			return {
				flag: false,
				flag1: false,
				flag2:false,
				money:'',
				payMent:0,
				img:null
			}
		},
		onLoad() {
			this.getInfo()
		},
		methods:{
			async getInfo(){
				let res=await this.get(pay)
				this.img=res.data.image
			},
			inputmoney(){
				if(this.money.trim()!=""){
					this.flag2=true;
				}else{
					this.flag2=false
				}
			},
			govx(){
				this.flag=!this.flag;
				this.flag1=false;
				this.payMent = 20
			},
			gozfb(){
				this.flag1=!this.flag1
				this.flag=false
				this.payMent = 30
			},
			sureChong(){
					// if(this.payMent==0){
					// 	this.msg("未选择支付方式","none")
					// }else{
					// 	// uni.showLoading({
					// 	//     title: '请稍后...'
					// 	// });
					// 	console.log(this.payMent)
					// 	//跳转扫码页面
						
					// 	// #ifdef APP-PLUS
					// 	if(this.payMent==20){
					// 		console.log(111)
					// 		uni.requestPayment({
					// 			    provider: 'wxpay',
					// 			    orderInfo: 'orderInfo', //支付宝订单数据
					// 			    success:(res)=> {
					// 			        console.log('success:',res);
										
					// 			    },
					// 			    fail: function (err) {
					// 			        console.log('fail:',err);
					// 			    }
					// 			});
							
					// 	}else if(this.payType==30){
					// 		// uni.requestPayment({
					// 		//     provider: 'alipay',
					// 		//     orderInfo: 'orderInfo', //支付宝订单数据
					// 		//     success:(res)=> {
					// 		//         console.log('success:',res);
									
					// 		//     },
					// 		//     fail: function (err) {
					// 		//         console.log('fail:',err);
					// 		//     }
					// 		// });
							
					// 	}
					// 	// #endif
					// }
					uni.navigateTo({
						url:'../payment/payali'
					})
					
			}
		}
	}
</script>

<style>
	.text{
		padding: 30rpx;
		text-align: center;
		margin-top: 40rpx;
		font-size: 32rpx;
	}
	.ma{
		width: 650rpx;
		height: 1000rpx;
		margin-left: 50rpx;
	}
	.container {
		padding: 40rpx 30rpx;
	}

	.invest-title {
		width: 104rpx;
		height: 37rpx;
		font-size: 26rpx;
		font-weight: 300;
		line-height: 37rpx;
		color: #999999;
		opacity: 1;
		margin-bottom: 30rpx;

	}

	.input-box {
		display: flex;
		border-bottom: 1px solid #D5D5D5;
		padding-bottom: 20rpx;
	}

	.icon-money {
		font-size: 36rpx;
		font-weight: 400;
		color: #333333;
	}

	.invest-style {
		width: 128rpx;
		height: 45rpx;
		font-size: 32rpx;
		font-weight: 400;
		line-height: 45rpx;
		color: #333333;
		margin-top: 72rpx;
	}

	.vx-box {
		width: 690rpx;
		height: 88rpx;
		background: #FFFFFF;
		border: 1px solid #41B035;
		opacity: 1;
		border-radius: 44rpx;
		margin-top: 50rpx;
		display: flex;
		align-items: center;
	}

	.vx-icon {
		width: 32rpx;
		height: 32rpx;
		margin-left: 52rpx;
	}

	.vx-icon>image {
		width: 32rpx;
	}

	.vx-text {
		width: 500rpx;
		font-size: 32rpx;
		font-weight: 400;
		color: #41B035;
		margin-left: 30rpx;
		height: 88rpx;
		line-height: 88rpx;
	}

	.uncheck {
		width: 26rpx;
		height: 26rpx;
		border-radius: 50%;
		background-color: #4DB6FF;
		/* margin-left: 370rpx; */
	}
	.ap{
		background-color: #41B035;
	}

	.zfb-box {
		width: 690rpx;
		height: 88rpx;
		background: #FFFFFF;
		border: 1px solid #4DB6FF;
		opacity: 1;
		border-radius: 44rpx;
		margin-top: 50rpx;
		display: flex;
		align-items: center;
	}

	.zfb-text {
		color: #4DB6FF;
	}

	.invest {
		width: 460rpx;
		height: 88rpx;
		background: #008573;
		opacity: 0.3;
		border-radius: 8rpx;
		font-size: 30rpx;
		font-weight: 400;
		line-height: 88rpx;
		color: #FFFFFF;
		text-align: center;
		margin: 170rpx auto;
	}
	.invest-after{
		background: #008573;
		opacity: 1;
	}
</style>
